<html>
<head>
    <script type='text/javascript' src='dwr/interface/RosterService.js'></script>
    <script type='text/javascript' src='dwr/engine.js'></script>
    <!-- css -->
    <link rel="stylesheet" type="text/css"
          href="http://yui.yahooapis.com/2.5.1/build/button/assets/skins/sam/button.css"/>
    <!-- js -->
    <script type="text/javascript"
            src="http://yui.yahooapis.com/2.5.1/build/yahoo-dom-event/yahoo-dom-event.js"></script>
    <script type="text/javascript" src="http://yui.yahooapis.com/2.5.1/build/element/element-beta-min.js"></script>
    <script type="text/javascript" src="http://yui.yahooapis.com/2.5.1/build/button/button-min.js"></script>
    <script type="text/javascript" src="http://yui.yahooapis.com/2.5.1/build/dragdrop/dragdrop-min.js"></script>
    <script type="text/javascript" src="js/ext.js"></script>
    <script type="text/javascript" src="js/rostra.js"></script>
    <script type="text/javascript" src="js/dragableElement.js"></script>
    <script type="text/javascript" src="js/rosterDetailsController.js"></script>
    <link rel="stylesheet" type="text/css" href="rostra.css"/>
</head>
<body>
<script type="text/javascript">
    createDomainObjectCreator("Create a roster", RosterService.createNewRoster, getRosters);
    createDomainObjectCreator("Create a person", RosterService.createNewPerson, getPeople);


</script>


<div class="List">
    <h2>List of Rosters</h2>
    <ul id="rosters"></ul>
</div>

<div class="List" id="peopleList">
    <h2>List of People</h2>
    <ul id="people"></ul>
</div>

<script type="text/javascript">
    getRosters();
    getPeople();
    document.body.appendChild(rosterDetailsController.getWidget());
</script>

</body>
</html>